import React from 'react';
import ReactDOM from 'react-dom';
import '../../static/tero/base.css'
import '../../static/app.css'
import { DatePicker } from 'antd';

import Table from './table.jsx'
import $ from 'jquery'
import u from '../../common.js'

const { RangePicker } = DatePicker;


class Warn extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      index: 0,
      display: 'none',
      operation: ['导出', '删除'],
      flag:true,
      type:0,
      warn:true,
      startTime:'',
      endTime:'',
      yanFlag:true,
    }
  }
  componentDidMount(){
    // $('.research').css({'display':'none'})
    var that = this;
    $('.app-top-ullist').find('li:last-child').siblings().click(function(){
      that.setState((prevState,props)=>({
        flag:true
      }))
    })

  }
  onChangeDate(moment, string) {
    this.setState((prevState, props) => ({
      startTime: string[0],
      endTime: string[1]
    }))
  }
  onOkDate() {
    this.refs.tabledate.tableData(1, u.substrTime(this.state.startTime,'start'), u.substrTime(this.state.endTime,'end')) 
  } 
  render() {
    return (
      <div className='app'>

        {/* <div className="app-header  app-headers">
          <div className="app-top  app-son">
            <ul className='app-top-ullist'>
              <li>时间：</li>
              <li>今日</li>
              <li>昨日</li>
              <li>近三日</li>
              <li>近七日</li>
              <li className={this.state.flag?'':'activve'} onClick={()=>{
                this.setState((prevState,props)=>({
                  flag:false
                }))
              }}>{this.state.flag?'自定义':<RangePicker
              showTime={{ format: 'HH:mm' }}
              format="YYYY-MM-DD HH:mm"
              placeholder={['Start Time', 'End Time']}
              onChange={this.onChangeDate}
              onOk={this.onOkDate}
            />}</li>
            </ul>
          </div>
        </div> */}
        <div className='app-conter'>
          <Table operation={this.state.operation} type={this.state.type} ref='tabledate' warn={this.state.warn} yanFlag={this.state.yanFlag}/>
        </div>
      </div>

    )
  }
}




export default Warn